<template>
    <div id="householdFileDetail">
        <van-field 
            readonly 
            v-for="(item,index) in BaseData"
            :key="index"
            v-model="BaseFrom[item.key]" 
            :label="item.name" 
            />
        <van-field readonly v-model="BaseFrom.renovateFlag" label="是否拆除" />
        <template v-if="BaseFrom.renovateFlag == '是'">
            <van-field readonly v-model="formData.removeDangerMode" label="整治方式" />
            <template v-if="formData.removeDangerMode == '拆除重建'"> 
                <van-field readonly v-model="ZZcityName" label="整治后房屋地址" />
                <van-field readonly v-model="formData.address" label="详细住址" />
                <van-field readonly v-model="formData.renovateBaseArea" label="整治后基底面积" />
                <van-field readonly v-model="formData.revovateFloor" label="整治后层数" />
                <van-field readonly v-model="formData.renovateBuildArea" label="整治后建筑面积" />
                <van-field readonly v-model="formData.renovateStructure" label="整治后房屋结构" />
                <van-field readonly v-model="formData.operateDate" label="开工时间" />
                <van-field readonly v-model="formData.finishDate" label="竣工时间" />
                <van-field readonly v-model="formData.certificateCard" label="不动产权证号" />
            </template>
            <template v-else-if="formData.removeDangerMode == '拆除灭失'">
                <van-field readonly v-model="formData.dismantleDate" label="拆除时间" />
            </template>
            <template v-else-if="formData.removeDangerMode == '拆除安置'">
                <van-field readonly v-model="formData.dismantleDate" label="拆除时间" />
                <van-field readonly v-model="ZZcityName" label="安置房屋地址" />
                <van-field readonly v-model="formData.address" label="安置详细住址" />
                <van-field readonly v-model="formData.placementDate" label="安置时间" />
            </template>
        </template>
    </div>
</template>
<script>
  import { 
    applyUpdateDetail,
 } from '@/utils/api'
export default {
    name: 'householdFileDetail',
    data(){
        return{
            JGLX: [
                {
                    name: '砌体结构',
                    value: 1,
                },
                {
                    name: '底部框架-上部砌体结构',
                    value: 2,
                },
                {
                    name: '钢筋混凝土结构',
                    value: 3,
                },
                {
                    name: '钢结构',
                    value: 4,
                },
                {
                    name: '木(竹)结构',
                    value: 5,
                },
                {
                    name: '土木/石木结构',
                    value: 6,
                },
                {
                    name: '混杂结构',
                    value: 7,
                },
                {
                    name: '窑洞',
                    value: 8,
                },
                {
                    name: '其他',
                    value: 99,
                },
            ],
            ZZcityName: '',
            formData: {},
            BaseFrom: {
                yhfwbh: '',
                fwbh: '',
                belongCity: '',
                belongCountry: '',
                belongTown: '',
                belongVillage: '',
                address: '',
                cqr: '',
                sfzh: '',
                fwyt: '',
                subFwyt: '',
                jzgn: '',
                tdxz: '',
                szqy: '',
                rymjcslx: '',
                cs: '',
                dcmj: '',
                jznd: '',
                buildTime: '',
                pcqkName: ''
            },
            BaseData: [
                {
                    name: '自建房安全排查编号',
                    key: 'yhfwbh'
                },
                {
                    name: '普查房屋编号',
                    key: 'fwbh'
                },
                {
                    "key": "belongCity",
                    "name": "所属市"
                },
                {
                    "key": "belongCountry",
                    "name": "所属区县"
                },
                {
                    "key": "belongTown",
                    "name": "所属乡镇"
                },
                {
                    "key": "belongVillage",
                    "name": "所属村"
                },
                {
                    "key": "address",
                    "name": "房屋地址",
                    "active": false,
                    "width": "100%",
                    "value": ""
                },
                {
                    "key": "cqr",
                    "name": "产权人(使用人)姓名",
                    "value": ""
                },
                {
                    "key": "sfzh",
                    "name": "身份证号",
                    "value": ""
                },
                {
                    "key": "fwyt",
                    "name": "房屋用途",
                    "value": ""
                },
                {
                    "key": "subFwyt",
                    "name": "是否同时居住",
                    "value": ""
                },
                {
                    "key": "jzgn",
                    "name": "具体用途",
                    "value": ""
                },
                {
                    "key": "tdxz",
                    "name": "土地性质",
                    "value": ""
                },
                {
                    "key": "szqy",
                    "name": "所在区域",
                    "value": ""
                },
                {
                    "key": "rymjcslx",
                    "name": "人员密集场所周边",
                    "value": ""
                },
                {
                    "key": "cs",
                    "name": "建筑层数",
                    "unit": "层",
                    "value": ""
                },
                {
                    "key": "dcmj",
                    "name": "建筑面积",
                    "unit": "m²",
                    "value": ""
                },
                {
                    "key": "jznd",
                    "name": "建造年代",
                    "value": ""
                },
                {
                    "key": "buildTime",
                    "name": "具体年份",
                    "unit": "年",
                    "value": ""
                },
                {
                    "key": "pcqkName",
                    "name": "现场排查情况",
                    "value": ""
                },
            ]
        }
    },
    mounted(){
        this.BaseFrom = JSON.parse(this.$route.query.data)
        if(this.BaseFrom.renovateFlag==1){
            this.BaseFrom.renovateFlag = '是'
        }else if(this.BaseFrom.renovateFlag==0){
            this.BaseFrom.renovateFlag = '否'
        }
    },
    methods:{
        getapplyUpdateDetail: async function(){
            let params = {
                "yhfwbh": this.BaseFrom.yhfwbh,
            }
            const res = await applyUpdateDetail(params)
            if (res.data && res.data.data) {
                if (res.data.data.address) {
                    this.BaseFrom.address = res.data.data.address;
                }
                if (res.data.data.renovate!='') {
                    this.formData = webResult.data.data.renovate;
                    let cityArr = [];
                    this.formData.belongCity ? cityArr.push(this.formData.belongCity) : "";
                    this.formData.belongCounty ? cityArr.push(this.formData.belongCounty) : "";
                    this.formData.belongTown ? cityArr.push(this.formData.belongTown) : "";
                    this.formData.belongVillage ? cityArr.push(this.formData.belongVillage) : "";
                    this.ZZcityName = cityArr.join(" / ")
                    this.JGLX.forEach(ele =>{
                        if(this.formData.renovateStructure == ele.value){
                            this.formData.renovateStructure = ele.name
                        }
                    })   
                }
                this.BaseFrom.renovateFlag = webResult.data.data.renovateFlag
                if(this.BaseFrom.renovateFlag==1){
                    this.BaseFrom.renovateFlag = '是'
                }else if(this.BaseFrom.renovateFlag==0){
                    this.BaseFrom.renovateFlag = '否'
                }
            }
        }
    }
}
</script>
<style lang="scss" scoped>
#householdFileDetail{
    height: 100vh;
    overflow-y: auto;
}
</style>